<template>
	<section>
		<el-row class="app-container">
			<el-row>
				<el-row >
					<el-col :span="20">
						<i class="el-icon-s-opportunity icon1"></i>
						<span style="color:#333; font-size:16px">流程:创建 - 政府办公厅发文稿纸 - 创建</span>
					</el-col>
					<el-col :span="4">
						<div class="rightButton">
							<el-button type="primary" size="small" @click="addSubmit" :loading="load.add">提交</el-button>
							<!-- <el-button type="primary" size="small">保存</el-button> -->
						</div>
					</el-col>
				</el-row>
				
				<el-tabs v-model="activeName" @tab-click="handleClick">
					<el-tab-pane label="流程表单" name="first">
						<el-col :span="24" style="color: rgb(216,34,37)">
							<h3 align="center">政府办公厅发文稿纸</h3>
							<el-form class="redItem" ref="addForm" :model="addForm" :rules="addFormRules" label-width="100px" size="mini">
								<el-row>
									<el-col :span="12">
										<el-form-item label="编号:" prop="doc_no">
											<el-input v-model="addForm.doc_no"  :disabled="true"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="4">
										<el-form-item label="密级:" prop="secrecyLevel">
											<el-select v-model="addForm.secrecyLevel" placeholder="请选择">
												<el-option
												v-for="item in secrecyLevel"
												:key="item.optionName"
												:label="item.optionName"
												:value="item.optionName">
												</el-option>
											</el-select>
										
										</el-form-item>
									</el-col>

									<el-col :span="4">
										<el-form-item label="紧急程度:" prop="urgencyLevel">
											<el-select v-model="addForm.urgencyLevel" placeholder="请选择">
												<el-option
												v-for="item in urgencyLevel"
												:key="item.optionName"
												:label="item.optionName"
												:value="item.optionName">
												</el-option>
											</el-select>
										</el-form-item>
									</el-col>

									<el-col :span="4">
										<el-form-item label="字名:" prop="wordName">
											<el-select v-model="addForm.wordName" placeholder="请选择">
												<el-option
												v-for="item in docTopicOptions"
												:key="item.label"
												:label="item.label"
												:value="item.label">
												</el-option>
											</el-select>
										</el-form-item>
									</el-col>


								</el-row>

								<el-row>
									<el-col :span="12">
										<el-form-item label="签发:">
											<el-input type="textarea" :rows="3" :disabled="true"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="12">
										<el-form-item label="快签:">
											<el-input type="textarea" :rows="3" :disabled="true"></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="12">
										<el-form-item label="办公室核稿:">
											<el-input type="textarea" :rows="2" :disabled="true"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="12">
										<el-form-item label="处理领导核稿:">
											<el-input type="textarea" :rows="2" :disabled="true"></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="8">
										<el-form-item label="主送:" prop="mainSend">
											<el-input readonly v-model="formName.mainSendName" @focus="openMainSendSelect" suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="8">
										<el-form-item label="抄送:" prop="carbonSendName">
											<el-input readonly v-model="formName.carbonSendName" @focus="openCarbonSendSelect" suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="8">
										<el-form-item label="拟稿单位:" prop="sendDeptName">
											<el-input readonly v-model="formName.sendDeptName"   @focus="openSendDept" suffix-icon="el-icon-search"></el-input>

										</el-form-item>
									</el-col>

									<el-col :span="8">
										<el-form-item label="拟稿:" prop="draftUsername" >
											<el-input readonly v-model="addForm.draftUsername"   @focus="openSelectUserDialog('draft')" suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="8">
										<el-form-item label="核稿:"  prop="checkUsername">
											<el-input readonly v-model="addForm.checkUsername" @focus="openSelectUserDialog('check')" suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="8">
										<el-form-item label="文种" prop="docTypeName">
											<el-input readonly v-model="formName.docTypeName" @focus="openDocTypeSelect" suffix-icon="el-icon-tickets"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="8">
										<el-form-item label="校对:" prop="checkedUsername">
											<el-input readonly v-model="addForm.checkedUsername"  @focus="openSelectUserDialog('checked')" suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="8">
										<el-form-item label="份数:" prop="copies">
											<el-input v-model="addForm.copies" ></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="12">
										<el-form-item label="标题" prop="docTitle">
											<el-input v-model="addForm.docTitle" ></el-input>
										</el-form-item>
									</el-col>

									<el-col :span="12">
										<el-form-item label="主题词" prop="topicName">
											<el-input readonly v-model="addForm.topicName" @focus="openDocTopicSelect" suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="12">
										<el-form-item label="签章动作" prop="signedUsername">
											<el-input readonly v-model="addForm.signedUsername"  @focus="openSelectUserDialog('signed')"  suffix-icon="el-icon-search"></el-input>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="12">
										<el-form-item label="附件">
											<!--附件上传插件 -->
											<div style="margin-left:28px; padding-bottom:10px">
												<attachment-upload 
														:archiveId="uploadArchiveId" 
														:categoryId="uploadCategoryId"
														:branchId="userInfo.branchId"
														></attachment-upload>
											</div>
										</el-form-item>
									</el-col>
								</el-row>

								<el-row>
									<el-col :span="12">
										<el-form-item label="正文">
											<el-input v-model="formName.archiveTitle" @focus="openArchiveSelect" clearable></el-input>
										</el-form-item>
									</el-col>
								</el-row>

							</el-form>
						</el-col>
					
					</el-tab-pane>
					<el-tab-pane label="流程图" name="second">流程图</el-tab-pane>
					<el-tab-pane label="流程状态" name="third">流程状态</el-tab-pane>
					<el-tab-pane label="正文" name="fourth">正文</el-tab-pane>
				</el-tabs>

			</el-row>
		</el-row>

		<!-- 文种选择组件 -->
		<doc-type-components ref="DocTypeComponents" @row-click="getDocType"></doc-type-components>
		<!-- 主题选择组件 -->
		<doc-topic-components ref="DocTopicComponents" @row-click="getDocTopic"></doc-topic-components>



		<!--（主送) ->部门选择组件-->
		<doc-archive-dept-select-components
			:showCheckbox="true"
			:branchId="userInfo.branchId"
			:defaultExpandAll="true"
			:multiple="true"
			:title="dialogTitle"
			@select-dept-node="mainSendDeptSelect"
			ref="openMainSend"
		></doc-archive-dept-select-components>	

		<!-- (抄送) ->部门选择组件-->
		<doc-archive-dept-select-components
			:showCheckbox="true"
			:branchId="userInfo.branchId"
			:defaultExpandAll="true"
			:multiple="true"
			:title="dialogTitle" 
			@select-dept-node="carbonSendDeptSelect"
			ref="openCarbonSend"
		></doc-archive-dept-select-components>	

		<!-- (拟稿单位)->部门选择组件(单选)-->
		<doc-archive-dept-select-components
			:showCheckbox="true"
			:branchId="userInfo.branchId"
			:defaultExpandAll="true"
			:title="dialogTitle"
			:isSingle="true"
			ref="openSendDept"
			@select-dept-node = "sendDeptSelect"
		></doc-archive-dept-select-components>	


		<!-- (拟稿人)->人员选择组件(单选)-->
		<doc-archive-user-select-components
			:isSingleUser="true"
			@get-user-data="getUserMsg($event, 'draft')"
			ref="openDraftUser"
		></doc-archive-user-select-components>

		<!-- (核稿人)->核稿选择组件(单选)-->
		<doc-archive-user-select-components
			:isSingleUser="true"
			@get-user-data="getUserMsg($event, 'check')"
			ref="openCheckUser"
		></doc-archive-user-select-components>

		<!-- (校对人)->校对选择组件(单选)-->
		<doc-archive-user-select-components
			:isSingleUser="true"
			@get-user-data="getUserMsg($event, 'checked')"
			ref="openCheckedUser"
		></doc-archive-user-select-components>

		<!-- (签章人)->校对选择组件(单选)-->
		<doc-archive-user-select-components
			:isSingleUser="true"
			:isSelectByDept="true"
			@get-user-data="getUserMsg($event, 'signed')"
			ref="openSignedUser"
		></doc-archive-user-select-components>

		<!--正文选择主件 -->
		<archive-select-components @get-archive-data="getArchiveData" ref="openArchiveSelect">
		</archive-select-components>


	</section>
</template>

<script>
	import util from '@/common/js/util';//全局公共库
	 
	import {sn} from '@/common/js/sequence'; //id生成器
	import { addDocArchive } from '@/api/mdp/arc/doc/docArchive';
	import { mapGetters } from 'vuex';
	import DocTypeComponents from '../docComponents/DocTypeComponents';
	import DocArchiveDeptSelectComponents from '../docComponents/DocArchiveDeptSelectComponents';
	import DocArchiveUserSelectComponents from '../docComponents/DocArchiveUserSelectComponents';
	import DocTopicComponents from '../docComponents/DocTopicComponents';
	import {listDocWordName} from '@/api/mdp/arc/doc/docWordName'; 


	export default { 
		inject:["reload"],
		computed: {
			...mapGetters([
				'userInfo'
			])
		},
		props:['docArchive','visible'],
		watch: {
			'docArchive':function( docArchive ) {
				this.addForm = docArchive;
			},
			'visible':function(visible) { 
				if(visible==true){
					//从新打开页面时某些数据需要重新加载，可以在这里添加
				}
			} 
		},
		data() {
			return {
				options:{},//下拉选择框的所有静态数据  params=[{categoryId:'0001',itemCode:'sex'}] 返回结果 {'sex':[{optionValue:'1',optionName:'男',seqOrder:'1',fp:'',isDefault:'0'},{optionValue:'2',optionName:'女',seqOrder:'2',fp:'',isDefault:'0'}]} 
				load:{ list: false, edit: false, del: false, add: false },//查询中...
				addFormRules: {
					docNo: [
						{ required: true, message: '文档编号不能为空', trigger: 'change' }
					],
					secrecyLevel: [
						{ required: true, message: '密级不能为空', trigger: 'change' }
					],
					urgencyLevel: [
						{ required: true, message: '紧急程度不能为空', trigger: 'change' }
					],
					draftUserid: [
						{ required: true, message: '拟稿人不能为空', trigger: 'change' }
					],
					docType: [
						{ required: true, message: '文种不能为空', trigger: 'change' }
					],
					checkedUsername: [
						{ required: true, message: '校对人不能为空', trigger: 'change' }
					],
					docTitle: [
						{ required: true, message: '标题不能为空', trigger: 'change' }
					],
					topicName: [
						{ required: true, message: '主题词不能为空', trigger: 'change' }
					],
					mainSend: [
						{ required: true, message: '主送不能为空', trigger: 'change' }
					],
					copies: [
						{ required: true, message: '份数不能为空', trigger: 'change' }
					],
					wordName: [
						{ required: true, message: '字名不能为空', trigger: 'change' }
					]
					
					
				},
				//新增界面数据 arc_doc_archive
				addForm: {
					//文档编号
					docNo:'',
					//档案年月日
					docYmd:'',
					//档案年度
					docYear:'',
					//档案类型
					docType:'',
					//份数
					copies: 1,
					signer:'',
					archiveId:'',
					wordNum:'',
					writtenDate:'',
					dispatchDate:'',
					//拟稿人id
					draftUserid:'',
					//拟稿人姓名
					draftUsername:'',
					checkUserid:'',
					checkUsername:'',
					checkedUserid:'',
					checkedUsername:'',
					secrecyLevel:'',
					urgencyLevel:'',
					topicName:'',
					topicId: '',
					docTitle:'',
					docFlowState:'',
					docProcInstId:'',
					wordName:'',
					//主送/抄送
					mainSend: [],
					//抄送
					carbonSend: [],
					//拟稿单位
					sendDept: '',
					//签章动作人
					signedUsername: '',
					//签章单位
					signedDeptid: '',
					//签章用户Id
					signedUserid:  '',
					//签章单位名
					signedDeptName: '',
					//主键
					docId: '',
					branchId: '',
				},

				//一些表单显示名称
				formName: {
					//公文名称
					archiveTitle: '',
					//档案文种名称
					docTypeName: '',
					//主送名称
					mainSendName: '',
					//抄送名称
					carbonSendName: '',
					//拟稿单位
					sendDeptName: '',
				},

				/**begin 在下面加自定义属性,记得补上面的一个逗号**/
				//默认选中框				
				activeName: 'first',
				//紧急程度
				urgencyLevel: [],
				//重要级别
				secrecyLevel: [],
				/**end 在上面加自定义属性**/
				dialogTitle: "多部门",
				//上传组件必要参数
				uploadArchiveId: '',
				uploadCategoryId: '',
				//公文主题options
				docTopicOptions: [],
			}//end return

		},//end data
		methods: {
			// 取消按钮点击 父组件监听@cancel="addFormVisible=false" 监听
			handleCancel:function(){
				this.$refs['addForm'].resetFields();
				this.$emit('cancel');
			},
			//新增提交DocArchive arc_doc_archive 父组件监听@submit="afterAddSubmit"
			addSubmit: function () {
				this.$refs.addForm.validate((valid) => {
					if (valid) {
						this.$confirm('确认提交吗？', '提示', {}).then(() => { 
							this.load.add=true
							let params = Object.assign({}, this.transformData(this.addForm)); 
							addDocArchive(params).then((res) => {
								this.load.add=false
								var tips=res.data.tips;
								if(tips.isOk){
									this.$refs['addForm'].resetFields();
									this.clearFormName();
									this.$emit('submit');//  @submit="afterAddSubmit"
									this.reload();
								}
								this.$message({ message: tips.msg, type: tips.isOk?'success':'error' }); 
							}).catch( err  => this.load.add=false);
						});
					}
				});
			},

			/**begin 在下面加自定义方法,记得补上面的一个逗号**/
			handleClick: function() {
			},


			transformData(data) {
				let target = [];
				data.mainSend.forEach(p => {
					target.push(p);
				})
				data.carbonSend.forEach(p => {
					target.push(p);
				})

				data.branchId = this.userInfo.branchId;
				let form = {
					docArchive: data,
					docSend: {
						docId: data.docId,
						signedUsername: data.signedUsername,
						signedDeptid: data.signedDeptid,
						signedUserid: data.signedUserid,
						signedDeptName: data.signedDeptName
					},
					docSendTargets: target
				}
				return form;
			},

			clearFormName() {
				this.formName = {
					archiveTitle: '',
					docTypeName: '',
					mainSendName: '',
					carbonSendName: '',
					sendDeptName: '',
				}
				this.addForm = {
					//文档编号
					docNo:'',
					//档案年月日
					docYmd:'',
					//档案年度
					docYear:'',
					//档案类型
					docType:'',
					//份数
					copies: 1,
					signer:'',
					archiveId:'',
					wordNum:'',
					writtenDate:'',
					dispatchDate:'',
					//拟稿人id
					draftUserid:'',
					//拟稿人姓名
					draftUsername:'',
					checkUserid:'',
					checkUsername:'',
					checkedUserid:'',
					checkedUsername:'',
					secrecyLevel:'',
					urgencyLevel:'',
					topicName:'',
					topicId: '',
					docTitle:'',
					docFlowState:'',
					docProcInstId:'',
					wordName:'',
					//主送/抄送
					mainSend: [],
					//抄送
					carbonSend: [],
					//拟稿单位
					sendDept: '',
					//签章动作人
					signedUsername: '',
					//签章单位
					signedDeptid: '',
					//签章用户Id
					signedUserid:  '',
					//签章单位名
					signedDeptName: '',
					//主键
					docId: '',
					branchId: ''
				}
			},

			//获取选择的docType的值
			getDocType: function(row, event, column) {
				this.addForm.docType = row.typeId;
				this.formName.docTypeName = row.typeName; 
			},

			//开启文种选择dialog
			openDocTypeSelect: function() {
				this.$refs.DocTypeComponents.open();
			},

			//获取公文主题的值
			getDocTopic(row, event, column) {
				this.addForm.topicName = row.topicName;
				this.addForm.topicId = row.topicId;
			},

			//开启公文主题的dialog
			openDocTopicSelect() {
				this.$refs.DocTopicComponents.open();
			},

			//开启主送选择dialog
			openMainSendSelect: function() {
				this.dialogTitle = "多部门";
				this.$refs.openMainSend.openDialog();
			},

			//开启抄送选择dialog
			openCarbonSendSelect: function() {
				this.dialogTitle = "多部门";
				this.$refs.openCarbonSend.openDialog();
			},
			
			//开启拟稿单位选择dialog
			openSendDept: function() {
				this.dialogTitle = "单部门";
				this.$refs.openSendDept.openDialog();			
			},

			//开启选择用户弹窗
			openSelectUserDialog: function(type)  {
				switch(type) {
					case 'draft':
						this.$refs.openDraftUser.openDialog();
					break;
					case 'check':
						this.$refs.openCheckUser.openDialog();
					break;
					case 'checked':
						this.$refs.openCheckedUser.openDialog();
					break;
					case 'signed':
						this.$refs.openSignedUser.openDialog();	
					break;
				}	
			},

			//开启选择正文dialog
			openArchiveSelect: function()  {
				this.$refs.openArchiveSelect.openDialog();
			},

			//获取公共参数: urgencyLevel:紧急程度 , secrecyLevel: 保密级别
			getCommonData: function() {
				let params = [
					{categoryId:'all',itemCode:'urgencyLevel'},
					{categoryId:'all',itemCode:'secrecyLevel'}
				]
				listOption(params).then((res) => {
					this.urgencyLevel = res.data.data.urgencyLevel
					this.secrecyLevel = res.data.data.secrecyLevel
				})
			},

			//主送选择部门
			mainSendDeptSelect(node) {
				if(node.length === 0) {
					this.formName.mainSendName = '';
					this.addForm.mainSend = [];
					return;
				}

				let mainSendName = "";
				let mainSend = [];

				node.forEach(e => {
					mainSendName += e.deptName + ",";
					let param = {
						targetId: e.deptid,
						targetName: e.deptName,
						targetType: 'dept',
						sendType: 'main',
					}
					mainSend.push(param);
				});

				mainSendName = (mainSendName.substring(mainSendName.length-1)==',')?mainSendName.substring(0,mainSendName.length-1):mainSendName;
				this.formName.mainSendName = mainSendName;
				this.addForm.mainSend = mainSend;
			},

			//抄送选择部门
			carbonSendDeptSelect(node) {
				if(node.length === 0) {
					this.formName.carbonSendName = '';
					this.addForm.carbonSend = [];
					return;
				}
				let carbonSendName = "";
				let carbonSend = [];
				node.forEach(e => {
					carbonSendName += e.deptName + ",";
					let param = {
						targetId: e.deptid,
						targetName: e.deptName,
						targetType: 'dept',
						sendType: 'carbon',
					}
					carbonSend.push(param);
				});
				carbonSendName = (carbonSendName.substring(carbonSendName.length-1)==',')?carbonSendName.substring(0,carbonSendName.length-1):carbonSendName;
				this.formName.carbonSendName = carbonSendName;
				this.addForm.carbonSend = carbonSend;
			},

			//拟稿单位选择部门
			sendDeptSelect(node) {
				if(node.length === 0) {
					this.addForm.sendDept = '';
					this.formName.sendDeptName = '';
					return;
				}
				this.formName.sendDeptName = node[0].deptName;
				this.addForm.sendDept = node[0].deptid;
			},

			//获取选择的拟稿人信息
			getUserMsg(data, type) {
				switch(type) {
					case 'draft':
						this.addForm.draftUserid = data[0].userid;
						this.addForm.draftUsername = data[0].username;
					break;
					case 'check':
						this.addForm.checkUserid = data[0].userid;
						this.addForm.checkUsername = data[0].username;
					break;
					case 'checked':
						this.addForm.checkedUserid = data[0].userid;
						this.addForm.checkedUsername = data[0].username;
					break;
					case 'signed':
						this.addForm.signedUserid = data[0].userid;
						this.addForm.signedUsername = data[0].username;
						this.addForm.signedDeptid = data.deptData.deptid;
						this.addForm.signedDeptName = data.deptData.deptName;
					break;
				}
			},

			//获取正文的id和标题
			getArchiveData(data) {
				this.formName.archiveTitle = data.archiveTitle;
				this.addForm.archiveId = data.archiveId;
			},

			//获取字名
			getWordName() {
				let params = {
					branchId: this.userInfo.branchId
				}
				listDocWordName(params).then((res) => {
					var tips=res.data.tips;
					if(tips.isOk){ 
						res.data.data.forEach(p => {
							let param = {
								label: p.wordName
							}
							this.docTopicOptions.push(param);
						})
					}else{
						this.$message({ message: tips.msg, type: 'error' });
					} 
				}).catch();
			},

			
			/**end 在上面加自定义方法**/
			
		},//end method
		components: {  
			//在下面添加其它组件 'doc-archive-edit':DocArchiveEdit
			'doc-type-components': DocTypeComponents,
			'doc-archive-dept-select-components': DocArchiveDeptSelectComponents,
			'doc-archive-user-select-components': DocArchiveUserSelectComponents,
			'doc-topic-components':DocTopicComponents
		},
		mounted() {
			this.addForm=Object.assign(this.addForm, this.docArchive);  
			/**在下面写其它函数***/
			this.$nextTick(() => {
				//获取公共数据
				this.getCommonData();
				//获取字名
				this.getWordName();
			});
			//生成docId
			this.addForm.docId = sn();
			this.uploadArchiveId = this.addForm.docId;
			//生成docIdCategory
			this.uploadCategoryId = 'docArchive_upload'
		}//end mounted
	}

</script>

<style >
.icon1 {
	font-size:24px;
	color: #409eff;
}

.rightButton {
	float: right;
}

.redItem .el-form-item__label {
	color: rgb(216,34,37);
	font-weight: normal;
}

.redItem .el-input {
	border: 1px red solid;
}

.redItem .el-textarea {
	border: 1px red solid;
}

</style>